import 'package:efood_multivendor/controller/auth_controller.dart';
import 'package:efood_multivendor/controller/splash_controller.dart';
import 'package:efood_multivendor/controller/transaction_controller.dart';
import 'package:efood_multivendor/controller/user_controller.dart';
import 'package:efood_multivendor/helper/price_converter.dart';
import 'package:efood_multivendor/helper/size_config.dart';
import 'package:efood_multivendor/util/dimensions.dart';
import 'package:efood_multivendor/util/styles.dart';
import 'package:efood_multivendor/view/base/custom_app_bar.dart';
import 'package:efood_multivendor/view/base/dialog_widget.dart';
import 'package:efood_multivendor/view/base/not_logged_in_screen.dart';
import 'package:efood_multivendor/view/screens/wallet/transaction_details_screen.dart';
import 'package:efood_multivendor/view/screens/wallet/transaction_view.dart';
import 'package:flutter/material.dart';
import 'package:flutter_feather_icons/flutter_feather_icons.dart';
import 'package:flutter_svg/svg.dart';
import 'package:get/get.dart';
import 'package:shared_preferences/shared_preferences.dart';
import 'wallet_point_bottom_sheet.dart';
import 'widget/wallet_card_pattern.dart';

class WalletScreen extends StatefulWidget {
  WalletScreen({Key? key}) : super(key: key);
  @override
  State<WalletScreen> createState() => _WalletScreenState();
}

class _WalletScreenState extends State<WalletScreen> {
  TransactionController? transactionController;
  double balance = 0.0;
  bool _isLoggedIn = Get.find<AuthController>().isLoggedIn();

  @override
  void initState() {
    WidgetsBinding.instance.addPostFrameCallback((_) async {
      if (_isLoggedIn) {
        Get.find<TransactionController>().getTransactionDetails(1);
        Get.find<UserController>().getUserInfo();
        // Get.find<SplashController>().setWalletScreen();
        customAlertDialog();
      }
    });

    super.initState();
  }

  Future<void> customAlertDialog() async {
    SharedPreferences prefs = await SharedPreferences.getInstance();
    if (prefs.getBool(
            'newToWallet${Get.find<UserController>().userInfoModel?.phone}') ==
        null) {
      Get.dialog(
        DialogWidget(
            context: context,
            prefs: prefs,
            title: 'wallet_dialog_title'.tr,
            image: 'assets/image/loyalty_new.png',
            description: 'wallet_dialog_description'.tr,
            fromPage: 'wallet'),
        barrierDismissible: false,
      );
    }
  }

  @override
  Widget build(BuildContext context) {
    return _isLoggedIn
        ? GetBuilder<UserController>(builder: (userController) {
            balance = userController.userInfoModel?.walletBalance ?? 0;
            return userController.userInfoModel != null
                ? GetBuilder<TransactionController>(
                    builder: (transactionController) {
                      bool isTransactionEmpty = false;
                      if (transactionController.historyTransactionList !=
                              null &&
                          transactionController
                                  .historyTransactionList?.isNotEmpty !=
                              true) {
                        isTransactionEmpty = true;
                      }
                      return Scaffold(
                          backgroundColor: Colors.white,
                          appBar: CustomAppBar(title: 'wallet'.tr),
                          body: RefreshIndicator(
                            onRefresh: () async {
                              await transactionController
                                  .getTransactionDetails(1);
                              await userController.getUserInfo();
                            },
                            child: Container(
                              child: Center(
                                child: SingleChildScrollView(
                                  physics:
                                      const AlwaysScrollableScrollPhysics(),
                                  child: Column(
                                    crossAxisAlignment:
                                        CrossAxisAlignment.center,
                                    children: [
                                      SizedBox(
                                        height: 1.h,
                                      ),
                                      Container(
                                        decoration: BoxDecoration(
                                            gradient: LinearGradient(
                                                colors: [
                                                  Theme.of(context)
                                                      .primaryColor,
                                                  Theme.of(context)
                                                      .colorScheme
                                                      .secondary,
                                                ],
                                                begin: Alignment.topLeft,
                                                end: Alignment.bottomRight),
                                            borderRadius:
                                                BorderRadius.circular(16)),
                                        height: 20.h,
                                        width: 90.w,
                                        child: Stack(
                                          children: [
                                            CustomPaint(
                                              size: Size(90.w,
                                                  (90.w * 0.67).toDouble()),
                                              painter: WalletCardPattern(),
                                            ),
                                            Column(
                                              mainAxisAlignment:
                                                  MainAxisAlignment.start,
                                              children: [
                                                Row(
                                                    mainAxisAlignment:
                                                        MainAxisAlignment.start,
                                                    crossAxisAlignment:
                                                        CrossAxisAlignment
                                                            .start,
                                                    children: [
                                                      SizedBox(
                                                        width: 15.w,
                                                        //  height: 3.h,
                                                      ),
                                                      Padding(
                                                        padding:
                                                            EdgeInsets.only(
                                                                top: 3.h,
                                                                bottom: 1.5.h),
                                                        child: Text(
                                                            'wallet_balance'.tr,
                                                            style: TextStyle(
                                                                color: Colors
                                                                    .white,
                                                                fontSize: Dimensions
                                                                    .fontSizeExtraLarge)),
                                                      ),
                                                    ]),
                                                Expanded(
                                                  child: Column(
                                                    children: [
                                                      Row(
                                                        mainAxisAlignment:
                                                            MainAxisAlignment
                                                                .start,
                                                        crossAxisAlignment:
                                                            CrossAxisAlignment
                                                                .center,
                                                        children: [
                                                          SizedBox(
                                                            width: 15.w,
                                                          ),
                                                          SvgPicture.asset(
                                                              'assets/icons/Wallet.svg'),
                                                          SizedBox(
                                                              width: 2.5.w),
                                                          Row(
                                                              mainAxisAlignment:
                                                                  MainAxisAlignment
                                                                      .start,
                                                              crossAxisAlignment:
                                                                  CrossAxisAlignment
                                                                      .center,
                                                              children: [
                                                                Text(
                                                                    PriceConverter
                                                                        .formatNumber(
                                                                            balance),
                                                                    style: sfBold.copyWith(
                                                                        fontSize:
                                                                            Dimensions.fontSizeLarge *
                                                                                2.7,
                                                                        color: Colors
                                                                            .white)),
                                                                Padding(
                                                                  padding: EdgeInsets
                                                                      .only(
                                                                          top: 2
                                                                              .h,
                                                                          left:
                                                                              1.w),
                                                                  child: Text(
                                                                    'pts'.tr,
                                                                    style: TextStyle(
                                                                        color: Colors
                                                                            .white),
                                                                  ),
                                                                )
                                                              ]),
                                                        ],
                                                      ),
                                                      //  SizedBox(height: 2),
                                                    ],
                                                  ),
                                                ),
                                                Row(
                                                  children: [
                                                    SizedBox(
                                                      width: 15.w,
                                                    ),
                                                    GestureDetector(
                                                      onTap: () {
                                                        showWalletPointBottomSheet(
                                                            context);
                                                      },
                                                      child: SizedBox(
                                                        width: 100,
                                                        height: 30,
                                                        child: Container(
                                                          decoration: BoxDecoration(
                                                              color:
                                                                  Colors.white,
                                                              borderRadius:
                                                                  BorderRadius
                                                                      .circular(
                                                                          12)),
                                                          child: Row(
                                                              mainAxisAlignment:
                                                                  MainAxisAlignment
                                                                      .center,
                                                              crossAxisAlignment:
                                                                  CrossAxisAlignment
                                                                      .center,
                                                              children: [
                                                                Text('Send'.tr,
                                                                    style: TextStyle(
                                                                        color: Colors
                                                                            .black,
                                                                        fontSize:
                                                                            Dimensions.fontSizeLarge)),
                                                                SizedBox(
                                                                  width: 8,
                                                                ),
                                                                Icon(
                                                                  Icons.send,
                                                                  size: 20,
                                                                ),
                                                              ]),
                                                        ),
                                                      ),
                                                    ),
                                                  ],
                                                ),
                                                SizedBox(
                                                  height: 12,
                                                )
                                              ],
                                            ),
                                          ],
                                        ),
                                      ),
                                      SizedBox(
                                        height: 6.h,
                                      ),
                                      Row(
                                        mainAxisAlignment:
                                            MainAxisAlignment.spaceBetween,
                                        children: [
                                          Padding(
                                            padding: EdgeInsets.only(
                                                left: 5.w, bottom: 1.h),
                                            child: Align(
                                              alignment: Alignment.centerLeft,
                                              child: Text(
                                                "transaction_history".tr,
                                                style: sfBold.copyWith(
                                                    fontSize: Dimensions
                                                            .fontSizeExtraLarge *
                                                        1.3),
                                              ),
                                            ),
                                          ),
                                          Padding(
                                            padding: EdgeInsets.only(
                                                right: 5.w, bottom: 1.h),
                                            child: GestureDetector(
                                              onTap: () {
                                                if (!isTransactionEmpty) {
                                                  Get.to(() =>
                                                      TransactionDetails());
                                                  Get.find<
                                                          TransactionController>()
                                                      .getTransactionDetails(1);
                                                }
                                              },
                                              child: Text('see_all'.tr,
                                                  style: TextStyle(
                                                    color: !isTransactionEmpty
                                                        ? Colors.deepOrange
                                                        : Theme.of(context)
                                                            .disabledColor,
                                                    fontWeight: FontWeight.w700,
                                                  )),
                                            ),
                                          )
                                        ],
                                      ),
                                      SizedBox(
                                        height: 2.h,
                                      ),
                                      SingleChildScrollView(
                                          child: Container(
                                        width: Dimensions.WEB_MAX_WIDTH,
                                        color: Colors.white,
                                        height: 55.h,
                                        child: TransactionView(),
                                      ))
                                    ],
                                  ),
                                ),
                              ),
                            ),
                          ));
                    },
                  )
                : Center(child: CircularProgressIndicator());
          })
        : Scaffold(body: NotLoggedInScreen());
  }

  void showWalletPointBottomSheet(BuildContext context) {
    showModalBottomSheet(
      context: context,
      isScrollControlled: true,
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.vertical(top: Radius.circular(20)),
      ),
      builder: (BuildContext context) {
        return WalletPointBottomSheet();
      },
    );
  }
}
